<template>
  <div style="position: relative;height: 100%;width: 100%;display: flex;padding: 10px 0 0 10px">
  <Userbar ref="userbar" v-on:update:conversation="updateConversation" :conversation="conversation"></Userbar>
  <ChatDialog ref="chatdialog" v-if="conversation != null" v-on:findCount="findCount" v-on:update:conversation="updateConversation" :conversation="conversation" ></ChatDialog>
</div>
</template>

<script>
  import Userbar from './Userbar'
  import ChatDialog from './ChatDialog'
  export default {
    name: 'Current',
    data () {
      return {
        conversation:null
      }
    },
    components: { Userbar,ChatDialog },
    methods: {
        updateConversation:function (conversation) {
            this.conversation = conversation;
        },
        findCount:function (userId) {
            this.$refs.userbar.findCount(userId);
        }
    },
    mounted(){
        this.$refs.userbar.findConversation(1);
    },
    destroyed: function() {
        this.as.setPageMessageCallback(null)
    }
  }
</script>

<style scoped>
</style>
